<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>12.缩略图</title>

<!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

	<link rel="stylesheet" href="../css/bootstrap.css" type="text/css"/>
	<script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap.js"></script>

</head>

<body>
	
    <div class="container">
    
    	<div class="row">
        	<div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/3.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/4.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/5.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/6.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/7.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/8.png">
            	</a>
            </div>

            <div class="col-xs-6 col-md-3">
            	<a href="#" class="thumbnail">
            		<img src="../img/9.png">
            	</a>
            </div>
        </div>

    </div>


	<!-- 自定义缩略图 -->
	<!--<div class="container">

		<div class="row">

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/3.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/4.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/5.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/6.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/7.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/8.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/9.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/10.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

			<div class="col-xs-6 col-md-3">
				<div class="thumbnail text-center">
					<img src="../img/11.png"/>
					<div class="caption">
						<h3>标题文字</h3>
						<p>这是对版块的描述文字</p>
						<p>
							<button type="button" class="btn btn-info">进入版块</button>
							<button type="button" class="btn btn-info">查看详细</button>
						</p>
					</div>
				</div>
			</div>

		</div>

	</div>-->
</body>
</html>